<script setup>
import { ref, reactive, computed,onMounted } from 'vue'
import axios from 'axios'
import Base from './components/Base.vue'

const students = ref([])

onMounted(()=>{
    getStudentList() 
})

function getStudentList() {
    axios.get('http://rap2api.taobao.org/app/mock/238982/students')
    .then(function (response) {
    console.log(response); 
    if(response.data.code == "0"){
        students.value = response.data.students
        console.log(students.value)
    }
    }
    )
    .catch(function (error) {
    console.log(error);
    });
}
</script>

<template>
    <Base></Base>
<div>
    <h1>Axios获取学生信息</h1>
    <button @click = "getStudentList">发送请求</button>
    <ul>
        <li v-for="(item,index) in students" :key = "index">
            <span>{{item.id}}</span>
            <span>{{item.name}}</span>
        </li>
    </ul>
</div>

</template>

<style>


</style>